<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta content="width=device-width,initial-scale=1,maximum-scale=1.0, user-scalable=no" name="viewport"/>
    <title>广州农商银行-端午节活动</title>
    <!-- <link rel="stylesheet" href="../styles/main.css"> -->
    <link rel="stylesheet" href="css/public.css">
    <link rel="stylesheet" href="css/form.css">
    <link rel="stylesheet" href="css/layer.css">
    <style type="text/css">
        .ui-window-1 .layercontent h3{font-size: 1.2rem;}
        .link{color: #3a540d;}
        .link:hover{color: #9A9A9A;}
        .ckbox-model{
            display: inline-block;
            width: 13px;
            height: 13px;
            background-image: url(img/ckbg2.png);
            background-repeat: no-repeat;
            background-size: 100%;
            vertical-align: middle;
            margin-bottom: 2px;
            margin-right: 3px;
        }
        .ckbox-model.deal{
            background-image: url(img/ckbg1.png);

        }
    </style>
    <script src="../JavaScript/jquery-1.8.3.min.js"></script>
    <script src="../JavaScript/layer.js"></script>

</head>
<body class="register">
    <header class="header-whole">
        <section class="logo">
            <img src="img/bank-logo.png" alt="广州农商银行">
        </section>
    </header>
    <section class="wrapper">
        <section class="title"><img src="img/title-reg.png" alt="注册"></section>
        <section class="form-box">
            <div class="text-outer">
                <input type="tel" class="input-text" placeholder="请输入手机号">
            </div>
            <div class="text-outer">
                <input type="text" class="input-text" placeholder="请输入图形验证码">
                <img src="img/auth-code.png" alt="验证码" class="auth btn-text">
            </div>
            <div class="text-outer">
                <input type="text" class="input-rs input-text" placeholder="请输入短信验证码">
                <!-- <button class="btn-text getcode">获&nbsp;&nbsp;取</button> -->
                <button class="btn-text getcode no-click">获&nbsp;&nbsp;取</button>
            </div>
            <div class="text-outer">
                <input type="password" class="input-rs input-text" placeholder="请设置6-16位数字字母密码">
                <button class="btn-text eyes"></button>
                <!-- <button class="btn-text eyes open"></button> -->
            </div>
            <div>
                <label for="checkbox1" class="checkbox-label" onselectstart="return false;">
                    <span class="ckbox-model"></span>同意
                </label><a href="#" target="_blank" class="link">《投融资服务协议》</a>
            </div>
        </section>
        <section class="submit-box">
            <a href="javascript:void(0);" class="back-btn"></a>
            <!-- <a href="javascript:void(0);" class="regs-btn"></a> -->
            <a href="javascript:void(0);" class="regs-btn no-click"></a>
        </section>
    </section>
    <footer class="footer-whole"></footer>
    
    <script type="text/javascript">
        $(function () {

            // var textHtml = '手机号码格式错误<br>请重新输入'; 
            // var textHtml = '图形验证码错误<br>请重新输入'; 
            var textHtml = '格式错误请输入<br>6-16位数字字母密码'; 
            // var textHtml = '短信验证码错误<br>请重新输入'; 

            /* 弹窗*/
            // $.layer({ title:"标题",contents: textHtml,autoclose: 3000, fadein:300});

            // checkbox 模拟 - (同意《投融资服务协议》)
            var modelCheck = function () {
                var hasDeal = false;
                $('.checkbox-label').click(function () {
                    if ( !hasDeal ) {
                        // 选中
                        $('.ckbox-model').addClass('deal');
                        hasDeal = true;
                    }
                    else {
                        $('.ckbox-model').removeClass('deal');
                        hasDeal = false;
                    }
                });
            };
            modelCheck();
                    

        });
    </script>
</body>
</html>
